<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>新建标签页</title>
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="css/style.css">
    <script src="js/tiny-commonjs-module.js"></script>
    <script src="node_modules/colorfulimg/colorfulImg.js"></script>
</head>

<body>
    <div id="app">
        <div class="settings">
            <span class="icon material-icon">&#xe8b8;</span>
        </div>
        <div class="search-box">
            <div class="search-logo"></div>
            <div class="search-select hidden blur">
                <template>
                    <div>
                        <span class="icon"></span>
                        <span class="name"></span>
                    </div>
                </template>
                <div class="manage-search-engine">
                    <span class="icon material-icon">&#xe8b8;</span>
                    <span class="name">管理搜索引擎</span>
                </div>
            </div>
            <form class="search-input blur" action="" method="">
                <div class="search-icon"></div>
                <input id="search-key" type="search" autocomplete="off" placeholder="搜索..." />
                <button class="search-button" type="submit">搜索</button>
                <div class="search-help hidden">
                    <div data="@links ">输入<span>@links</span>搜索快速链接</div>
                    <div data="/">输入<span>/关键词</span>指定搜索引擎</div>
                    <div data="">输入<span>?</span>查看帮助</div>
                    <div data="#">输入<span>#</span>查看历史记录</div>
                </div>
                <div class="search-command hidden">
                    <template class="engine"></template>
                    <template class="command"></template>
                </div>
                <div class="search-history hidden"></div>
            </form>
        </div>
        <div class="shortcut-filter">
            <div class="material-icon">&#xe8b6;</div>
            <input type="text" name="" id="" placeholder="搜索 (Alt + S)">
        </div>
        <div class="shortcuts">
            <template>
                <div class="shortcut">
                    <span class="indicator"></span>
                    <img class="icon" draggable="false" />
                    <div class="banner">
                        <span class="name"></span>
                        <div class="action">
                            <span class="edit material-icon">&#xe3c9;</span>
                            <span class="delete material-icon">&#xe5cd;</span>
                        </div>
                    </div>
                </div>
            </template>
            <div class="shortcut add-shortcut">
                <span class="icon material-icon">&#xe145;</span>
                <div class="banner">
                    <span class="name">添加</span>
                </div>
            </div>
            <div class="pages-indicator">
                <div class="page-indicator"></div>
                <div class="page-indicator"></div>
                <div class="page-indicator"></div>
            </div>
        </div>
    </div>
    </div>
    <div class="wallpaper"></div>
    <script type="module" src="js/script.js"></script>
</body>

</html>